<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>分店管理-首页</title>
	<link rel="stylesheet" href="/js/plugin/layui-v2.3.0/layui/css/layui.css">
	<link rel="stylesheet" href="/css/reset.css">
	<link rel="stylesheet" href="/css/index.css">
	<script src="/js/jquery-2.1.1.min.js"></script>
	<script src="/js/plugin/layui/layui.js"></script>
</head>
<style>
::-webkit-scrollbar-thumb {
  background:#a2a2a2; 
  border-radius: 10px;
  height:50%;
}
::-webkit-scrollbar{width:6px;}
	body{
		overflow-y: scroll;
	} 
a.contract_add:hover{color:#62a8e9 !important;}
 .layui-table-view .layui-table td,.layui-table-view .layui-table th {padding:10px 0px;} 
 .layui-table-cell{height: 100%;line-height: 20px;} 
</style>
<body>

	<div class="kb-content my-locations-list">	
	<input type="hidden" id="projectId" name="projectId" th:value="${projectId}" /> 
					<section class="kb-content-container clearfix">
						<div class="nav-section-content-container pad-top-30 clearfix">
							<div class="nav-content-1 f-left">
								<div class="location-box clearfix">
									<header>
										分店信息			
									</header>
									<div class="f-left" style="width:276px;height:182px;margin-top:20px">
										<img class="" th:src="${record.attachment!=null}? |${record.attachment.filePath}${record.attachment.id}${record.attachment.fileType}|:'/images/jtdoor_pic.jpg'" alt="" style="width:100%;height:100%">
									</div>
									<div class="f-right" style="width:420px;">
										<div class="chart-out_box flex-center">
											<div class="chart-box">
												<a href="#">
													<div class="statistic-box">
														<div class="header">
															<span class="number">19</span>
														</div>
														<div class="name">
															<span>总工位</span>
														</div>
													</div>
												</a>
											</div>
											<div class="chart-box">
												<a href="#">
													<div class="statistic-box">
														<div class="header">
															<span class="number">19</span>
															<span class="unit">个</span>
														</div>
														<div class="name">
															<span>出租工位数</span>
														</div>
													</div>
												</a>
											</div>
											<!-- <div class="chart-box">
												<a href="#">
													<div class="statistic-box">
														<div class="header">
															<span class="number">171</span>
															<span class="unit">个</span>
														</div>
														<div class="name">
															<span>财务入驻率</span>
														</div>
													</div>
												</a>
											</div> -->
										</div>
										<div class="chart-out_box flex-center">
										<div class="chart-box">
											<a href="#">
												<div class="statistic-box">
													<div class="header">
														<span class="number">19</span>
													</div>
													<div class="name">
														<span>入驻会员</span>
													</div>
												</div>
											</a>
										</div>
										<div class="chart-box">
											<a href="#">
												<div class="statistic-box">
													<div class="header">
														<span class="number">19</span>
														<span class="unit">个</span>
													</div>
													<div class="name">
														<span>团队</span>
													</div>
												</div>
											</a>
										</div>
										<!-- <div class="chart-box">
											<a href="#">
												<div class="statistic-box">
													<div class="header">
														<span class="number">171</span>
														<span class="unit">个</span>
													</div>
													<div class="name">
														<span>财务入驻率</span>
													</div>
												</div>
											</a>
										</div> -->
									</div>
									</div>
								</div>
								<div class="location-box">
									<header>
										分店信息			
									</header>
									<div class="box-content">
										<div class="t-center m-updown">
											<img class="net-problem-pic" src="/images/network-problem.jpg" alt="">
											<p class="color-nine">还没有信息</p>
										</div> 		
									</div>
								</div>
								<div class="location-box">
									<header>
										账单信息			
									</header>
									<div class="box-content">
										<table class="layui-hide" id="LAY_table_bill" lay-filter="bill"></table> 		
									</div>
								</div>
							</div>
							<div class="nav-content-2 f-right">
								<div class="nav-container-content">
									<header class="nav-inner-header clear-fix"><h2 class="header-title">管理团队</h2></header>
									<ul class="desk-2-ul">
										<li th:id="${team.id}" th:each="team : ${teams}">
											<a class="flex">
												<div class="desk-user-img-2">
													<img th:if="${team.user.sysAttachmentPortrait!=null}" th:src="|${team.user.sysAttachmentPortrait.filePath}${team.user.sysAttachmentPortrait.id}${team.user.sysAttachmentPortrait.fileType}|" style="width: 30px; height: 30px; border-radius: 100px;">
													<img th:if="${team.user.sysAttachmentPortrait==null}" src="/images/132.png" style="width: 30px; height: 30px; border-radius: 100px;">
												</div>
												<div class="desk-user-message-2">
													<div class="desk-user-name-2">
													<p class="desk-user-icon">
														<span style="display: initial; margin-right: 5px;" th:text="${team.user.userName}"></span>
														<i th:if="${team.teamRole=='1'}" class="layui-icon color-golden">&#xe67b;</i>
													</p>
													<p><span th:if="${team.teamRole=='1'}" >(负责人)</span>
														<span th:if="${team.teamRole=='2'}" >(运营人员)</span>
														<span th:if="${team.teamRole=='3'}" >(财务人员)</span>
														<span th:if="${team.teamRole=='4'}" >(核销人员)</span>
														<span th:if="${team.teamRole=='5'}" >(确认核销人员)</span>
														<span th:if="${team.teamRole=='6'}" >(观察人员)</span>
														<span th:if="${team.teamRole=='7'}" >(报修负责人)</span>
														<span th:if="${team.teamRole=='8'}" >(合同审批人)</span>
													</p>
														
													</div>
												</div>
											</a>
										</li>
									</ul>
								</div>
								<div class="nav-container-content">
									<header class="nav-inner-header clear-fix"><h2 class="header-title">快捷方式</h2></header> 
									<a href="javascript:;" style="width: 112px;height:112px;display: block; text-align: center;color:#333" class="contract_add">
										<i class="layui-icon" style="display: block;font-size: 40px;padding-top: 20px;">&#xe655;</i> 
										<span>添加新合同</span>
									</a> 
								</div>
							</div>
							
						</div>		
					</section>
				</div>
</body>
<script>
$(function(){
	layui.use(['table'], function(){
		  var element = layui.element;
		  var table = layui.table;
		//方法级渲染
		table.render({
			id:'bill',
		    elem: '#LAY_table_bill',
		    url: '/app/contractReceivable/listdata',
		    where:{
		    	params:{
		    		bill:1,
		    		flag:1
		    	}
		    },
		    cols: [[
				      {field: 'status', title: '收款状态',templet:function(d){
				    	  var time = new Date().getTime()-new Date(d.receivableDate).getTime();
				    	  var days = parseInt(time/(1000 * 60 * 60 * 24));
				    	   if(d.state == 0){
				    		   if(days > 0){
				    			   return '<span style="display:inline-block;background:#e6e6e6;color:#666;padding: 5px 10px;text-align:center;">已逾期</span>'; 
				    		   }else{
				    			   return '<span style="display:inline-block;background:#f2a73d;color:#fff;padding: 5px 10px;text-align:center;">待支付</span>'; 
				    		   }
				    		  
				    	  }else{
				    		  return '<span style="display:inline-block;background:#0AC862;color:#fff;padding: 5px 10px;text-align:center;">确认核销</span>';
				    	  } 
				      }}
				      ,{field: 'fkDicReceivableType', title: '账单类型',templet:function(d){
				    	  if(d.fkDicReceivableType == 0){
				    		  return '租金';
				    	  }else if(d.fkDicReceivableType == 1){
				    		  return '押金';
				    	  }else{
				    		  return '退款';
				    	  }
				      }}
				      , {field: 'receivableNumber', title: '公司名称',width:'30%',templet:function(d){
				    	  var time = new Date().getTime()-new Date(d.receivableDate).getTime();
				    	  var days = parseInt(time/(1000 * 60 * 60 * 24));
				    	  if(days > 0 && d.state ==0){
				    		  return '<div style="color:#333">'+d.team.fullName+'<span style="color:#dd5a55"> (已逾期'+days+'天)</span><br><span>账单：'+d.receivableNumber+'</span></div>'; 
					    	  
				    	  }else{
				    		  return '<div style="color:#333">'+d.team.fullName+'</div>账单：'+d.receivableNumber; 
				    	  }
				    	  
				      }}
				      , {field: 'receivableAmount', title: '应收金额'}
				      , {field: 'receivableDate', title: '到期日期'}
				      , {field: 'paymentDate', title: '实际付款日',templet:function(d){
				    	  if(d.paymentDate){
				    		  return d.paymentDate;
				    	  }else{
				    		  return '无';
				    	  }
				      }}
				      
				    ]]
		    ,page: false
			
		});
	});
	
	
	
	$(".contract_add").on("click",function(){
		var projectId = $("#projectId").val();
		parent.parent.layer.open({
			type: 2, 
			title:"选择团队",
			area: ['600px','250px'],
			   shade: [0.6, '#000'],
			   zIndex:800,
			content:"/app/customerTeam/chooseTeam/"+projectId  
			
		});
	})
})

</script>
</html>